<template>
    <div class="table">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item> 活动管理中心</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="handle-box" style="border-bottom:1px solid #eee;padding-bottom:10px;">
            <el-button type="default" icon="plus" @click="addActivity=true">创建活动</el-button>
        </div>


        <div class="item-container">

            <ul>
                <li class="item-container-inline" v-for="item in [1,2,3,4,5,6]">
        
                 <div class="item-list">
                     <div class="item-list-info" >
                         <div class="item-list-detail">
                           <div>活动名称：在线K歌</div>
                           <div>活动内容：活动内容简介</div>
                           <div>活动起止时间：2018-03-19至2018-04-05</div>
                     </div>
                         <div class="item-list-detail item-list-btn">
                            <el-button type="default"  @click="getData">活动暂定</el-button>
                         </div>
                     </div>
                 </div>
                </li>
            </ul>
        </div>


  

        <div class="pagination">
            <el-pagination
                    @current-change ="handleCurrentChange"
                    layout="prev, pager, next"
                    :total="all_page">
            </el-pagination>
        </div>


          <el-dialog title="创建活动" :visible.sync="addActivity">
           <el-form>
             <el-form-item label="活动标题" label-width="120px">
                <el-col>
                <el-input v-model="typeName"  placeholder="请输入活动标题"   auto-complete="off" style="width:300px;"></el-input>
               </el-col>
             </el-form-item>
             <el-form-item label="活动内容" label-width="120px">
                <el-col>
                <el-input  type="textarea"  v-model="typeName"  placeholder="请输入活动内容"   auto-complete="off" style="width:300px;"></el-input>
               </el-col>
             </el-form-item>
             <el-form-item label="活动开始时间" prop="a_publish_time" label-width="120px">
               <el-col>
                   <el-date-picker type="datetime"   placeholder="选择日期"  v-model="intime"  style="width:300px;"></el-date-picker>
               </el-col>
              </el-form-item>
            
              <el-form-item label="活动截至时间" prop="a_publish_time" label-width="120px">
                <el-col>
                 <el-date-picker type="datetime"   placeholder="选择日期"  v-model="outtime"  style="width:300px;"></el-date-picker>
                 </el-col>
              </el-form-item>
           </el-form>
  <div slot="footer" class="dialog-footer">
     <el-button type="default" @click="closeEdit">关闭</el-button>
    <el-button type="danger" @click="saveNewsType">保存</el-button>
  </div>
</el-dialog>




    </div>
</template>

<script>
import * as rpConfig from "../../../rpConfig/constant";
import { HttpReq } from "../../service/server";
var Server = new HttpReq();
export default {
  data() {
    return {
      url: "./static/vuetable.json",
      newsCenter: [],
      intime: "",
      outtime:"",
      addActivity: true
    };
  },
  created() {
    this.getData();
    this.getType();
  },
  computed: {},
  methods: {
    handleCurrentChange(val) {
      this.cur_page = val;
      this.getData();
    },
    closeEdit() {
      this.addActivity = false;
    },
    getData() {
      let self = this;
      Server._POST(
        rpConfig.API_URI + "/newscenter.Index/getNewsByCon",
        {
          page: self.cur_page,
          a_type_id: self.select_cate,
          keyword: self.select_word
        },
        function(res) {
          self.newsCenter = res.data.data;
          self.all_page = Math.ceil(res.data.num / res.data.pagesize) * 10;
        }
      );
    },
    getType() {
      let self = this;
      Server._POST(
        rpConfig.API_URI + "/newscenter.Index/getNewsType",
        {},
        function(response) {
          self.typeCenter = response.data;
        }
      );
    },
    time_filter(row) {
      return row.a_publish_time.substring(0, 16);
    },
    publish_formatter(row) {
      return row.a_state == 1 ? "上线内容" : "草稿";
    },
    filterTag(value, row) {
      return row.tag === value;
    },
    handleEdit(row) {
      this.$router.push("/newsedit/" + row.a_id);
      //this.$message('编辑第' + (index + 1) + '行')
    },
    handleInTop(row) {
      let self = this;
      Server._POST(
        rpConfig.API_URI + "/newscenter.Index/setInTop",
        { item_id: row.a_id, a_top: row.a_top },
        function(response) {
          self.$message.success(response.msg);
          self.getData();
        }
      );
    },
    handleDelete(row) {
      let self = this;
      Server._POST(
        rpConfig.API_URI + "/newscenter.Index/deleteNewsItem",
        { item_id: [row.a_id] },
        function(response) {
          self.$message.success(response.msg);
          self.getData();
        }
      );
    },
    delAll() {
      const self = this,
        length = self.multipleSelection.length;
      let delArr = [];
      for (let i = 0; i < length; i++) {
        delArr.push(self.multipleSelection[i].a_id);
      }
      if (delArr.length == 0) {
        self.$message.info("请选择要删除的记录");
      } else {
        Server._POST(
          rpConfig.API_URI + "/newscenter.Index/deleteNewsItem",
          { item_id: delArr },
          function(response) {
            self.$message.success(response.msg);
            self.getData();
          }
        );
      }

      self.multipleSelection = [];
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    }
  }
};
</script>

<style scoped>
/* 数据列表 */
@import url("../../../static/css/activity-list.css");
.item-list-detail div {
  margin-bottom: 10px;
}
</style>